.fl {
    float: left;
}

.fr {
    float: right;
}

.w {
    width: 1200px;
    margin: 0 auto;
}

/* 加载字体图标 */
@font-face {
    font-family: 'icomoon';
    src:  url('../fonts/icomoon.eot?oq4iee');
    src:  url('../fonts/icomoon.eot?oq4iee#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?oq4iee') format('truetype'),
    url('../fonts/icomoon.woff?oq4iee') format('woff'),
    url('../fonts/icomoon.svg?oq4iee#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

/* header代码 */
.header{
    position: relative;  /*  相对定位   */
    height: 80px;
    padding-top: 20px;
    /*border-bottom: 2px solid #b1191a;*/
}

.logo span{
    font-size: 26px;
}

/* 登录主要区域 */
.login-container{
    height: 486px;
    background-color: #7f00ff;
}

.banner{
    height: 486px;
    /*background-color: lightyellow;*/
    background: url(../upload/loginbg.png) no-repeat;
}
/*登录表单 */
.login-form{
    position: relative;
    float: right;
    width: 338px;
    height: 338px;
    top: 88px;
    right:88px ;
    background-color: #ffffff;
}

/* tab切换按钮 */
.tab-list{
    
}

.tab-list li{
    float: left;
    height: 42px;
    line-height: 42px;
    font-size: 16px;
    border-bottom: 1px solid #cccccc;
    text-align: center;
}

.tab-list li:first-child{
    width: 169px;
}
.tab-list li:last-child{
    width: 167px;
    border-left: 1px solid #cccccc;
}

.tab-list li.active{
    border-bottom: 1px solid transparent;
}

/* 表单*/
.zhuce-box{
    margin: 0 auto;
    width: 280px;
    height: 240px;
    padding-top: 80px;
}


.form-item{
    height: 40px;
    width: 280px;
    margin-bottom: 10px;
    font-size: 0;
}

.username-label{
    display: inline-block;
    background: url(../images/user-pwd-icons.png) no-repeat;
    width: 38px;
    height: 38px;
    border: 1px solid #cccccc;
    vertical-align: middle;
}

.password-label{
    display: inline-block;
    background: url(../images/user-pwd-icons.png) -48px 0  no-repeat;
    width: 38px;
    height: 38px;
    border: 1px solid #cccccc;
    vertical-align: middle;
}

#username{

}

.form-item input{
    display: inline-block;
    height: 38px;
    width: 234px ;
    outline: none;
    padding-left: 5px;
    vertical-align: middle;
    border: 1px solid #cccccc;
    border-left: none;
}

.form-btn a{
    display: block;
    height: 40px;
    width: 100%;
    /* append style */
    background-color: #D3111A;
    color: #ffffff;
    text-align: center;
    line-height: 40px;
    font-size: 18px;
    letter-spacing:5px;
}

/*  扫码盒子  */
.code-box{
    width: 280px;
    height: 300px;
    margin: 0 auto;
}

.code-wrapper{
    width: 100%;
    height: 280px;
    margin-top: 60px;
    text-align: center;
}

.code-wrapper h3{
    text-align: center;
    font-size: 16px;
}

.code-wrapper img{
    width: 174px;
    height: 174px;
}

.login-by-username{
    width: 280px;
    text-align: right;
    margin-top: 20px;
}


/* footer */
/*底部 */
.links{
    overflow: hidden;
}

.links ul{
    width: 810px;
    height: 18px;
    margin: 22px auto 10px;
}

.links li{
    float: left;
    width: 80px;
    text-align: center;
    border-right: 1px solid #999999;
}

.links .last{
    border: none;
}

.footer p{
    text-align: center;
    line-height: 20px;
}